{% extends 'extend.html' %}
{% load common_tag %}
{% block body %}

<div id="myCarousel" class="carousel slide">
    <ol class="carousel-indicators">
        {% for i in tops %}
        <li data-target="#myCarousel" data-slide-to="{{ forloop.counter0 }}" {% if forloop.counter0 == 0 %}class="active"{% endif %}></li>
        {% endfor %}
    </ol>
    <div class="carousel-inner">
        {% for i in tops %}
        <div style="background: url('{{i.image|safe}}');background-size: cover" class="item {% if forloop.counter0 == 0 %} active{% endif %}">
            <a href="/article/{{ i.sid }}" target="_blank" style="height: 300px;width: 100%;display: block"></a>
        </div>

        {% endfor %}
    </div>
    <a class="carousel-control left" href="#myCarousel"
       data-slide="prev"> <span _ngcontent-c3="" aria-hidden="true" class="glyphicon glyphicon-chevron-left"></span></a>

    <a class="carousel-control right" href="#myCarousel"
       data-slide="prev">
        <span aria-hidden="true" data-slide="next" class="glyphicon glyphicon-chevron-right"></span></a>
</div>

    <div class="block">
        <div class="block-title">
            <span>最新发布</span>
            <a href="{% url 'category' %}" class="float float-right">查看更多</a>
        </div>
        {% for i in articles %}
            <div class="aritcle-item clearfix">

            {% if i.image %}
                <div class="col-md-8">
            {% else %}
                <div class="col-md-12">
            {% endif %}
        <div class="title-panel">
            <a href="/article/{{ i.sid }}" class="title"> {{ i.title }}</a>
        </div>

        <div class="info">
                            <span class="date"><span
                                    class="glyphicon glyphicon-calendar"></span>{{ i.createDate }}</span>
            <span>
                                <span class="glyphicon glyphicon-pencil"></span>
                                <span>发表在 <a
                                        href="{% url 'category_alias' i.category__alias %}">{{ i.category__name }}</a> </span>
                            </span>
            <span class="hits">
                            <span class="glyphicon glyphicon-eye-open"></span>
                            <span>{{ i.hits }}</span>
                        </span>
        </div>
        </div>
        {% if i.image %}
            <div class="col-md-4">
                <div class="cover">
                    <img src="{{ i.image|url }}!600"/>
                </div>
            </div>
        {% endif %}
        </div>
        {% endfor %}
        <div class="show-more">
            <a href="{% url 'category' %}" class="btn btn-success">查看更多数据</a>
        </div>
        </div>
        <script src="" type="text/javascript"></script>
{% endblock %}